/**
 * 选择器封装
 */
function query(selector) {
  var el = document.querySelectorAll(selector);
  // 如果el里的成员只有一个,就返回这个成员
  if (el.length === 1) {
    return el[0];
  } else {
    return el;
  }
}

/**
 * 单个标签绑定事件
 * evenType 事件类型
 * selector 选择器
 * 注: 该方法用了html5的新选择器,所以不兼容低版本浏览器
 */
function bindEvent(evenType, selector, callback) {
  var el = document.querySelector(selector);
  el[`on${evenType}`] = callback;
}

/**
 * 多个标签绑定事件 事件托管
 * eventType 事件类型
 * parent 要托管的选择器
 * child 要绑定事件的选择器
 * callback 监听器
 */
function bindEvents(eventType,parent, child, callback) {
  var parentEL = document.querySelector(parent);
  var childrenEl = document.querySelectorAll(child);

  parentEL[`on${eventType}`] = function () {
    // 如果点击的target在childrenEl里面,则执行回调
    childrenEl.forEach(function (item) {
      if (event.target === item) {
        callback.call(item, event);
      }
    });
  }
}